<template>
  <div class="father">
    <h3>父组件</h3>
    <h3 v-show="toys">儿子给父的玩具：{{ toys }}</h3>
    <!-- 给子组件绑定事件 -->
    <Child @send-toy="getToy" />
  </div>
</template>

<script setup lang="ts" name="Father">
import { ref } from "vue";
import Child from "./Child.vue";
const toys = ref("");
//获取子组件传来的玩具
function getToy(val: string) {
  console.log("儿子给父的玩具:", val);
  toys.value = val;
}
</script>

<style scoped>
.father {
  background-color: rgb(165, 164, 164);
  padding: 20px;
  border-radius: 10px;
}
</style>
